<?php $this->layout('layout.php') ?>
<?php $this->title = 'Products list' ?>
<?php $this->noCartLayout=true;?>
<div data-ng-controller="ProductsController">
	<?php $this->insert('cart/cart.php');?>
	<div class="filterProduct">
		<div class="content">
			<ul class="filters">
				<li>
					<label>Name:</label>
					<input type="text" autocomplete="off" name="name" data-ng-model="search" data-ng-keyup-timeout="productsView.filterName(search)"/>
				</li>
				<li>
					<label>Price:</label>
					<input type="text" autocomplete="off" placeholder="start price" name="name" data-ng-model="startPrice" data-ng-keyup-timeout="productsView.filterPrice(startPrice, endPrice)"/>
					<input type="text" autocomplete="off" placeholder="end price" name="name" data-ng-model="endPrice" data-ng-keyup-timeout="productsView.filterPrice(startPrice, endPrice)"/>
				</li>
				<li>
					<label>Qty:</label>
					<input type="text" autocomplete="off" placeholder="start qty" name="name" data-ng-model="startQty" data-ng-keyup-timeout="productsView.filterQty(startQty, endQty)"/>
					<input type="text" autocomplete="off" placeholder="end qty" name="name" data-ng-model="endQty" data-ng-keyup-timeout="productsView.filterQty(startQty, endQty)"/>
				</li>
			</ul>
			<div class="text">Filters:</div>

		</div>
	</div>
	<div id="productList" data-infinite-scroll='productsView.nextPage()' data-masonry='{"columnWidth": 300, "gutter":50, "isFitWidth":true}' data-infinite-scroll-disabled='productsView.busy' data-infinite-scroll-distance='1'>
		<div class="item masonry-brick"  data-ng-repeat='product in productsView.products'>
			<img data-ng-src="{{ product.img }}" class="productImg" src="nothing.jpg" alt="{{ product.title }}"/>
			<div class="content">
				<div class="title">{{ product.title }}</div>
				<hr/>
				<p class="description">{{ product.description }}</p>
				<hr/>
				<div class="info">
					<div class="number"><label>Qty:</label> {{ product.number }}</div>
					<div class="price"><label>Price:</label> {{ product.price }}€</div>
				</div>
				<div class="control">
					<img alt="cart" src="<?= HTTPNAME ?>/assets/images/small/03.png" class="cartImg" data-ng-click='productCart.addCart(product)'>
				</div>
			</div>
		</div>
	</div>
</div>
